<template>
  <div class="abstract">
    <h3><i></i>内容简介</h3>
    <div class="content">
      {{infoObj.content}}
    </div>
    <div class="border"></div>
    <h3><i></i>老师简介</h3>
    <div class="content">
      {{infoObj.person}}
    </div>
    <div class="teacherDetail" v-for='(item,index) in teacherList' :key='index'>
      <img :src="item.pic" width="34" height="34" />
      <div>
        <span>{{item.username}}</span>
        <p>已被{{item.fans_num}}人关注</p>
      </div>
      <span class="focus" v-show='!item.isConcern && !isTeacher' @click="concernTeacher(item.uid,index)">关注</span>
      <span class="focus" v-show='item.isConcern' @click="cancelConcern(item.uid,index)">已关注</span>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        infoObj: {},
        teacherList: [],
        attentStatus: false, //关注状态 默认未关注
        isTeacher: false, //是否用户和该课程老师是同一人 默认否
        userid: '',
      }
    },
    methods: {
      //获取点进来的某个专栏信息
      getDetailsData() {
        this.id = this.$route.query.id;
        this.userid = localStorage.getItem("loginMobile");
        this.$api.get(this.$api.baseURLSchool, "select_cid/special/" + this.id, {}, r => {
          // console.log(r);
          if (r.data.ret == 1) {
            this.infoObj = r.data.info;
          }

        }, err => {
          console.log(err);
        })
      },
      isLogin() {
        if (!this.userid) {
          // this.$router.push({name:'login1'}) 
          this.$utils._toast('请先登录!');
          return false;
        } else {
          return true;
        }
      },
      // 判断用户和该课程老师是否同一人
      justIsTeacher(tid, userid) {
        if (tid == userid) {
          this.isTeacher = true;
        }
      },
      //获取专栏下的课程列表中某一课程id
      getCidList() {
        //id是专栏id
        this.userid = localStorage.getItem("loginMobile");
        this.id = this.$route.query.id;
        this.$api.get(this.$api.baseURLSchool, "selectdata/sub_special/" + this.id, {}, r => {
          // console.log(r);
          var that = this;
          if (r.data.ret == 1) {
            var list = r.data.info;
            var jsonObj = {};
            list.forEach(function (val, index) {
              var cid = val.cid;
              that.getCourseByCid(cid, index, jsonObj);
            });
          }

        }, err => {
          console.log(err);
        })

      },
      //根据cid获取对应课程信息
      getCourseByCid(cid, index, jsonObj) {
        console.log('/////*-', cid);
        this.$api.get(this.$api.baseURLSchool, "select_cid/view_course_user/" + cid, {}, r => {
          console.log('/////*', r);
          //判断如果教师表中已经有这个教师了 就不push
          if (r.data.ret == 1) {
            if (!jsonObj[r.data.info.uid]) {
              this.teacherList.push(r.data.info);
              jsonObj[r.data.info.uid] = 1;


              //根据uid(用户id)查粉丝数
              const params = {
                id: r.data.info.uid,
              };
              this.getFansnumByTid(params, index);
              //根据userid和id查看用户是否收关注老师
              var uid = r.data.info.uid;
              if (this.userid) {
                this.justIsTeacher(uid, this.userid);
                this.justIsConcern(uid, index);
              }


            }
          }

        }, err => {
          console.log(err);
        })

      },
      //根据userid和tid查看用户是否收关注老师
      justIsConcern(tid, index) {
        var tid = this.$route.query.id;
        console.log(tid)
        console.log(index)
        this.$api.post(this.$api.baseURLSchool, "/selecttype/attention/0?userid=" + this.userid + "&type=fans&id=" +
          tid, {}, r => {
            // console.log(r);
            if (r.data.records > 0) {
              this.$set(this.teacherList[index], 'isConcern', true);
            } else {
              this.$set(this.teacherList[index], 'isConcern', false);
            }
          }, err => {
            console.log(err);
          })
      },
      //根据老师id查老师粉丝数
      getFansnumByTid(params, index) {
        console.log('***-', params)
        this.$api.post(this.$api.baseURLSchool, "attent/fans", params, r => {
          // console.log(r);
          if (r.data.info.count) {
            this.$set(this.teacherList[index], 'fans_num', r.data.info.count);
          } else {
            this.$set(this.teacherList[index], 'fans_num', 0);
          }
        }, err => {
          console.log(err);
        })
      },
      //点击关注老师
      concernTeacher(tid, index) {
        if (!this.isLogin()) {
          return false;
        }
        this.$api.post(this.$api.baseURLSchool, "play_only/attention?userid=" + this.userid + "&type=fans&id=" + tid, {},
          r => {
            // console.log(r);
            if (r.data.ret1 == 1) {
              this.$utils._toast("关注成功");
              //关注状态更新
              this.justIsConcern(tid, index);
              //粉丝数更新
              const params = {
                id: tid,
              };
              this.getFansnumByTid(params, index);
            } else if (r.data.ret1 == -1) {
              this.$utils._toast("关注失败");
            } else if (r.data.ret1 == 0) {
              this.$utils._toast("已经关注过")
            }
          }, err => {
            console.log(err);
          })
      },
      //取消关注
      cancelConcern(tid, index) {
        this.$api.post(this.$api.baseURLSchool, "play_cancel/attention?userid=" + localStorage.getItem("loginMobile") +
          "&type=fans&id=" + tid, {}, r => {
            // console.log(r);
            if (r.data.ret1 == 1) {
              this.$utils._toast("取消关注成功");
              //关注状态更新
              this.justIsConcern(tid, index);
              //粉丝数更新
              const params = {
                id: tid,
              };
              this.getFansnumByTid(params, index);
            }
          }, err => {
            console.log(err);
          })
      },
    },
    created() {
      this.getDetailsData();
      this.getCidList();
      // this.justIsConcern();

    }
  }

</script>
<style lang="scss" scoped>
</style>
